<div class="row">
  <h1 translate lib="web">clients</h1>
</div>
<div class="row">
  <div class="col-md-6">
  </div>
  <div class=" col-md-6 text-right">
    <a ng-href="#/WebsocketClients" ng-show="menuctrl.hasrole('admins')" class="btn">sockets</a>

    <em class="fas fa-cog fa-spin" ng-show="ctrl.loading==true" title="Hang on, loading data"></em>
    <!-- <em class="fas fa-cog" ng-show="ctrl.loading!=true" title="I spin, while loading data"></em> -->
    <input type="checkbox" id="checkbox-1" ng-model="ctrl.showinactive" ng-change="ctrl.loading = false; ctrl.page = 0;ctrl.loadData()"> 
    <label for="checkbox-1"><span translate lib="web"
      >showinactive</span></label>

      <input type="radio" id="checkbox-2" value="openrpa" ng-model="ctrl.show" ng-change="ctrl.loading = false; ctrl.page = 0;ctrl.loadData()"> 
    <label for="checkbox-2"><span translate
      lib="web" >openrpa</span></label>

      <input type="radio" id="checkbox-3" value="nodered" ng-model="ctrl.show" ng-change="ctrl.loading = false; ctrl.page = 0;ctrl.loadData()"> 
    <label for="checkbox-3"><span translate
      lib="web" >nodered</span></label>

      <input type="radio" id="checkbox-4" value="webapp" ng-model="ctrl.show" ng-change="ctrl.loading = false; ctrl.page = 0;ctrl.loadData()"> 
    <label for="checkbox-4"><span translate
      lib="web" >web</span></label>

      <input type="radio" id="checkbox-5" value="assistant" ng-model="ctrl.show" ng-change="ctrl.loading = false; ctrl.page = 0;ctrl.loadData()"> 
      <label for="checkbox-5"><span translate
        lib="web" >assistant</span></label>

        <input type="radio" id="checkbox-6" value="agent" ng-model="ctrl.show" ng-change="ctrl.loading = false; ctrl.page = 0;ctrl.loadData()"> 
        <label for="checkbox-6"><span translate
          lib="web" >agent</span></label>
  
      <input type="radio" id="checkbox-7" value="all" ng-model="ctrl.show" ng-change="ctrl.loading = false; ctrl.page = 0;ctrl.loadData()"> 
    <label for="checkbox-7"><span translate
      lib="web" >showall</span></label>
  </div>
</div>
<div ng-show="ctrl.errormessage != ''" class=" alert alert-danger" role="alert">{{ctrl.errormessage}}</div>
<table id="table1" class="table table-striped table-hover table-sm" when-scrolled="ctrl.more()" style="width: 100%;">
  <thead class="thead-dark">
    <tr>
      <th scope="col" ng-click="ctrl.ToggleOrder('name')"><strong translate lib="web">name</strong></th>
      <th scope="col" ng-click="ctrl.ToggleOrder('_rpaheartbeat')"><strong translate lib="web">robot</strong></th>
      <th scope="col" ng-click="ctrl.ToggleOrder('_noderedheartbeat')"><strong translate lib="web">nodered</strong></th>
      <th scope="col" ng-click="ctrl.ToggleOrder('_webheartbeat')"><strong translate lib="web">web</strong></th>
      <th scope="col" ng-click="ctrl.ToggleOrder('_lastopenrpaclientversion')"><strong translate
          lib="web">lastclientversion</strong>
      </th>
      <th></th>
    </tr>
  </thead>
  <tbody>
    <tr ng-repeat="model in ctrl.models">
      <td>{{model.name}}</td>
      <td>
        <timesince ng-model="model._rpaheartbeat" />
      </td>
      <td>
        <timesince ng-model="model._noderedheartbeat" />
      </td>
      <td>
        <timesince ng-model="model._webheartbeat" />
      </td>
      <td>
        <div ng-show="ctrl.show == 'openrpa'">{{model._lastopenrpaclientversion}}</div>
        <div ng-show="ctrl.show == 'nodered'">{{model._lastnoderedclientversion}}</div>
        <div ng-show="ctrl.show == 'webapp'">{{model._lastwebappclientversion}}</div>
        <div ng-show="ctrl.show == 'all'">{{model._lastclientversion}}</div>
      </td>
      <td class="text-right">
        <a href ng-click="ctrl.ShowWorkflows(model)" class="btn">workflows</a>
        <a ng-href ng-click="model._id == ctrl.WebSocketClientService.user._id || ctrl.Impersonate(model)" class="btn"
          ng-class="{disabled: model._id == ctrl.WebSocketClientService.user._id}">
          <em class="fas fa-user-secret"></em></a>
          <!-- <a href ng-click="model.hasnodered!=true || ctrl.OpenNodered(model)" ng-disabled="model.hasnodered==true"
          class="btn" ng-class="{disabled: model.hasnodered!=true}">
          <em class="fas fa-project-diagram"></em></a>
        <a ng-href="#/Nodered/{{model._id}}" class="btn" ng-disabled=""
          ng-class="{disabled: menuctrl.WebSocketClientService.allow_personal_nodered != true}">
          <em class="fas fa-tools"></em></a> -->
        <a ng-href="#/Entity/{{ctrl.collection}}/{{model._id}}" class="btn">
          <em class="fas fa-edit"></em></a>
      </td>
    </tr>
  </tbody>
</table>